<template>
  <div>
    <y-header :active="'zmzx'"></y-header>
    <div class="person_body clearfix">
      <y-side :type="'kyptjcg'" :showSide="'zm'"></y-side>
       <div class="person_content">   
         <div class="person_info ">
          <table class="table ">
            <thead>
              <tr>
                <th>序号</th> 
                <th>标题</th>                  
                <th>发布时间</th>                                        
                <th>内容</th>             
              </tr>
            </thead>
            <tbody>
                  <tr v-for="(item, index) in list" :key="item.id">               
                     <td>{{index + 1}}</td>   
                    <td class="name">{{item.title}}</td>                 
                    <td class="name">{{item.gmtCreate}}</td>   
                     <td class="operate">
                      <router-link tag="a" target="_blank" :to="'/detail?id=' + item.id + '&title=' + item.title" class="text_link">
                        查看详情
                    </router-link>    
                    </td>
                  </tr>                                            
            </tbody>
          </table>
        </div>
      </div>
    </div>
    <y-footer></y-footer>
  </div>
</template>
<script>
import YHeader from '~/components/common/Header'
import YFooter from '~/components/common/Footer'
import YSide from '~/components/TerraceSide'
import {listByType, getById} from '~/api/article.js'

export default {

   data () {
    return {
      load: false,
      tab: 1,
      num: 1,
      list: [],
    }
  },
  methods: {
      getArticleByType() {
        listByType({type:2}).then(res => {
               
                if (res.data.code === 200 && res.data.data.list.length > 0 ) {                 
                  this.list = res.data.data.list;               
                } else {
                  if (res.code >= 300 && res.code < 400) {
                    this.$msgBox({
                      content: res.msg,
                      isShowCancelBtn: false
                    }).then(() => {
                      this.$store.dispatch('REDIRECT_LOGIN', result.code)
                    }).catch(() => {
                      this.$store.dispatch('REDIRECT_LOGIN', result.code)
                    })
                  } else {               
                    this.$msgBox({
                      content: '暂无内容',
                      isShowCancelBtn: false
                    }).catch(() => {})
                  }
                }     
              }).catch(() => {
                this.solidBtn = false;
                this.$msgBox({
                  content: '暂无内容',
                  isShowCancelBtn: false
                });
                  this.obj ='';  
              })
     },
  },
  created () {
    this.getArticleByType();
  },
  components: {
    YHeader,
    YFooter,
    YSide
  }
}
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
@import '~/assets/css/account.scss';

  .person_body {
    width: 1200px;
    margin: 30px auto 0;
    min-height: 1000px;
  }
  .person_content {
    width: 1012px;
    float: right;
    background: #fff;
    border-radius: 6px
  }
  .person_info {
    padding: 0px 50px 50px;
    min-height: 400px;
    font-size: 14px;
    color: #333;
    line-height: 28px;
  }

  .name{
    .form_input{
      margin: 10px 0;
      height: 34px;
      border: 1px solid #e7e7e7;
      width: 278px;
      text-indent: 1em;
    }
  }
  .cont_btn {
    width: 280px;
    display: block;
    margin:20px auto 0;
  }

   .table td.name {
    text-align: center;
  }
  .table th {
    line-height: 36px;
    color: #333;
    background-color: #ffffff;
}
</style>